<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Developed By M Abdur Rokib Promy">
<meta name="author" content="cosmic">
<meta name="keywords" content="Bootstrap 3, Template, Theme, Responsive, Corporate, Business">
<link rel="shortcut icon" href="${Prefix}img/favicon.png">
<title>
<#if Site.seoTitle?? && Site.seoTitle !="">${Site.seoTitle}<#else>${Site.name}</#if>
</title>
<link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
<link href="${Prefix}node_modules/animate.css/animate.min.css" rel="stylesheet" >
<link href="${Prefix}node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="${Prefix}node_modules/element-ui/lib/theme-chalk/index.css" rel="stylesheet">
<link href="${Prefix}node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet">

<link href="${Prefix}css/header.css" rel="stylesheet">
<link href="${Prefix}css/footer.css" rel="stylesheet">
<link href="${Prefix}css/banner.css" rel="stylesheet">
<link href="${Prefix}css/main.css" rel="stylesheet">
<link href="${Prefix}css/zcjsq.less" rel="stylesheet/less" type="text/css">

<script src="${Prefix}node_modules/jquery/dist/jquery.min.js"></script>
<script src="${Prefix}node_modules/wowjs/dist/wow.min.js"></script>
<script src="${Prefix}node_modules/swiper/dist/js/swiper.min.js"></script>
<script src="${Prefix}node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="${Prefix}node_modules/less/dist/less.js"></script>
<script src="${Prefix}node_modules/vue/dist/vue.js"></script>
<script src="${Prefix}node_modules/element-ui/lib/index.js"></script>
</head>

<script>
    // let listData = {}
    // let PageNo = 1
    // let PageSize = 5

    // function buildPage(id,isF){
    //     // listData.total = 500
    //     var newList = listData.rows.slice((PageNo-1)*5, (PageNo)*5);
    //     var html = newList.map(row => {
    //         const tags = row?.tags.map(tag =>{
    //             const tagsStr = `<div class="tags-item">`+ tag +`</div>`
    //             return tagsStr
    //         })
    //         const unit = row?.extendData?.ModelData_issuing_unit || '-'
    //         const pub = row?.publishDateInstance || '-'
    //         const str = `
    //             <a href="`+ row.link +`" target="_blank" rel="noopener noreferrer">
    //                 <div class="list-item">
    //                     <div class="title">
    //                         <div class="info">`+ row.title +`</div>
    //                     </div>
    //                     <div class="tags">` + tags + `</div>
    //                     <div class="text">
    //                         <div>发布日期：`+ pub +`</div>
    //                     </div>
    //                     <div class="text">
    //                         <div>发文单位：`+ unit +`</div>
    //                     </div>
    //                 </div>
    //             </a>`
    //         return str

    //     }).join("");

    //     $('.choose-l-btn[num="' + id + '"]').find('span').html(listData.total)
    //     $(".data-list").html(html);

    //     var total = 0
    //     // 遍历每个.choose-l-btn元素
    //     $(".choose-l-btn").each(function(index, element){
    //         // 获取每个元素下面的span的值
    //         var spanValue = $(element).find('span').text();
    //         total = total + (spanValue-0)
    //     });

    //     $("#top-sub-tj-total").html(total)

        
    //     $('.paginator').html(buildPaginator(PageNo-0,listData.total-0,PageSize))
    //     // 使用jQuery选择器找到要监听的元素，并添加点击事件监听器
    //     $('.paginator-btn').click(function() {
    //         var num = $(this).attr("num");
    //         console.log(num)
    //         PageNo = num - 0
    //         $('.paginator').html('')
    //         buildPage(id)
    //     });
    //     $('.go-btn').click(function(){
    //         var num = $('.go-num').val()
    //         console.log(num)
    //         if((num-0)>PageCount ){
    //             num = PageCount
    //         }
    //         if((num-0<1)){
    //             num = 1
    //         }
    //         PageNo = num - 0
    //         $('.paginator').html('')
    //         buildPage(id)
    //     })

    //     if(!isF){
    //         // 使用jQuery的animate方法滚动页面到锚点位置
    //         $('html, body').animate({
    //             scrollTop: $('#top').offset().top
    //         }, 800); // 800是滚动动画的持续时间，单位为毫秒
    //     }
    // }
	// function queryResult(q,id) {
	// 	var pageSize = 10;
	// 	$.ajax({
	// 		url: "${ApiPrefix}api/cms/search/policyQuery?sid=${Site.siteId}&pp=pc&q=" +q+"&declarationTimeSign="+id,
	// 		type: "get",

	// 		headers: {
	// 			"Authorization": new URL(window.location.href).searchParams.get('Authorization')
	// 		},
			
	// 		success: function(res) {
	// 			if (res.code != 200) {
	// 				alert(res.msg);
	// 				return;
	// 			}
    //             listData = res.data || {}
    //             PageNo = 1
    //             buildPage(id,true)
	// 		}
	// 	})
	// }

    $(document).ready(function(){
        // var params = new URLSearchParams(window.location.search);
        // $('#top-input-name').val(params.get('enterpriseName'))
        // var p = ""
        // var arr = ['enterpriseType','enterpriseNature','enterpriseField']
        // arr.forEach((item)=>{
        //     const pItem = params.get(item)
        //     if(pItem&&pItem!='undefined'&&pItem!='null'){
        //         p= p + pItem
        //     }
        // })

        // var btnArr = ['申报待开始','申报中','申报已结束']
        // var cltStr = ''
        // btnArr.forEach((item,index)=>{
        //     cltStr = cltStr +  ("<div class='choose-l-btn' num='"+ (index+1) +"'>"+ item +"（<span></span>）</div>")
        //     console.log(cltStr,'cltStr')
        // })
        // $('.choose-l').html(cltStr)


        // // 点击事件处理
        // $(".choose-l-btn").on("click", function(){
        //     // 移除先前选中项的类
        //     $(".choose-l-btn").removeClass("choose-l-btn-active");
        //     // 给被点击项添加选择类
        //     $(this).addClass("choose-l-btn-active");

        //     // 获取被点击元素的id
        //     var id = $(this).attr("num");
        //     console.log("被点击元素的id是：" + id);

        //     queryResult(p,id);
            
        // });

    });
</script>


<body>
<!--header start-->
<@cms_include ssi="false"file="header.template.html"></@cms_include>
<!--header end-->
<@cms_include ssi="false"file="banner.template.html"></@cms_include>
<div class="zcjsq-list-bg" id="app">
    <div class="container zcjsq-list">
        <div class="content-column">
            <div class="row">
                <div class="col">
                    <div class="top-tips">
                        <div class="top-tips-l">
                            <span>企业名称：</span>
                            <el-input v-model="name" disabled size="small" type="text" placeholder="请输入企业名称" style="width: 320px;"></el-input>
                        </div>
                        <div class="top-tips-r">
                            <div class="tips-r-t">
                                <span>完善企业简历</span>
                                <div class="pre">
                                    <div class="pre-bg">
                                        <div class="pre-show" style="width: 50%;"></div>
                                    </div>
                                    <div class="pre-num">50%</div>
                                </div>
                            </div>
                            <div class="other">
                                <i class="fa fa-info-circle"></i>
                                <span>企业简历越完善，匹配的政策越精准</span>
                            </div>
                        </div>
                    </div>
                    <div class="cnter-content " id="top">
                        <div class="top-img"><img src="${Prefix}images/t-1.png" alt=""></img></div>
                        <div class="top-sub-remark">注意：平台根据您填写的企业信息提供政策智能匹配服务、最终申报结果以政府公示为准</div>
                        <div class="top-sub-tj">
                            <div>推荐申报政策（符合申报条件）：<span id="top-sub-tj-total">{{allTotal}}</span>条</div>
                            <div>可能获得扶持资金范围：<span>根据实际情况给予扶持</span></div>
                        </div>
                        <div class="sub-top-choose">
                            <div class="choose-l">
                                <div :class="['choose-l-btn',chooselbtnindex == 1&&'choose-l-btn-active']" @click="onChooseLBtn(1)">申报待开始<span>（{{numArr[0]}}）</span></div>
                                <div :class="['choose-l-btn',chooselbtnindex == 2&&'choose-l-btn-active']" @click="onChooseLBtn(2)">申报中<span>（{{numArr[1]}}）</span></div>
                                <div :class="['choose-l-btn',chooselbtnindex == 3&&'choose-l-btn-active']" @click="onChooseLBtn(3)">申报已结束<span>（{{numArr[2]}}）</span></div>
                            </div>
                        </div>
                        <div class="data-list">
                            <a v-for="(item,index) in listData" :key="index" :key="index" :href="item.link" target="_blank" rel="noopener noreferrer">
                                <div class="list-item">
                                    <div class="title">
                                        <div class="info">{{item.title || '-'}}</div>
                                    </div>
                                    <div class="tags" >
                                        <div v-for="(item2,index2) in item.tags" class="tags-item">{{item2}}</div>
                                    </div>
                                    <div class="text">
                                        <div>发布日期：{{item?.publishDateInstance || '-'}}</div>
                                    </div>
                                    <div class="text">
                                        <div>发文单位：{{item?.extendData?.ModelData_issuing_unit || '-'}}</div>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div style="text-align: right;padding: 40px 0;">
                            <el-pagination
                                v-if="total>0"
                                @current-change="handleCurrentChange"
                                background
                                :current-page.async="currentPage"
                                :page-size="pageSize"
                                layout="total, prev, pager, next, jumper"
                                :total="total">
                            </el-pagination>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    new Vue({
        el: '#app',
        data: function() {
            return {
                name:'',
                queryParams:'',
                chooselbtnindex: 1,
                listData: [],
                numArr: [],
                allTotal: 0,
                total:0,
                currentPage: 1,
                pageSize: 10,
                olData:null
            }
        },
        created(){
    
        },
        mounted(){
            var params = new URLSearchParams(window.location.search);
            this.name = params.get('enterpriseName')
            var q = ""
            var arr = ['enterpriseType','enterpriseNature','enterpriseField']
            arr.forEach((item)=>{
                const pItem = params.get(item)
                if(pItem&&pItem!='undefined'&&pItem!='null'){
                    q= q + pItem
                }
            })
            this.queryParams = q
            this.queryResult(this.queryParams,1,true)
            setTimeout(()=>{
                this.queryResult(this.queryParams,2)
            },500)
            setTimeout(()=>{
                this.queryResult(this.queryParams,3)
            },1000)
            
        },
        methods: {
            handleCurrentChange(val) {
                this.listData = this.olData.rows.slice((val-1)*10, (val)*10)
                $('html, body').animate({
                    scrollTop: $('html').offset().top
                }, 800); // 800是滚动动画的持续时间，单位为毫秒
            },
            onChooseLBtn(val){
                this.chooselbtnindex = val
                this.currentPage = 1
                this.listData = []
                this.total =  0 
                this.queryResult(this.queryParams,val,true)
            },
            queryResult(q,id,isF) {
                var that = this
                $.ajax({
                    url: "${ApiPrefix}api/cms/search/policyQuery?sid=${Site.siteId}&pp=pc&q=" +q+"&declarationTimeSign="+id,
                    type: "get",
                    headers: {
                        "Authorization": new URL(window.location.href).searchParams.get('Authorization')
                    },
                    success: function(res) {
                        if (res.code != 200) {
                            alert(res.msg);
                            return;
                        }
                        that.numArr[id-0-1] = res.data.rows.length

                        console.log(that.numArr,'that.numArr')
                        var total = 0
                        that.numArr.forEach((item,index)=>{
                            total = total + item
                        })
                        that.allTotal = total
                        if(isF){
                            that.olData = res.data

                            console.log(that.currentPage,'that.currentPage')
                            that.listData = that.olData.rows.slice((that.currentPage-1)*10, (that.currentPage)*10)
                            that.total = that.olData.total - 0 
                        }
                    }
                })
            }
        },
    })
 </script>
<@cms_include ssi="false"file="footer.template.html"></@cms_include>
</body>
</html>
